import React, {useEffect, useState, forwardRef, useImperativeHandle, useMemo} from 'react';
import PageModule from "@/components/PageModule.tsx";
import {Form, Row, Table, Button, message} from "antd";
import CustomUpload from '@/components/CustomUpload.tsx'
import CycleForm from "@/components/DynamicSearchForm/CycleForm.tsx";
import PageActionBar from "@/components/PageActionBar.tsx";
import {findDicNameForDicCode, getDicOnCode} from "@/utils/dicAll.ts";
import {onlyNumberLast2Digits} from "@/utils/regular.ts";
import {querySaleListForProject} from "@/axios/apis.ts";
import {downloadFileForUrl} from "@/utils";

const FileInfo = forwardRef(({carFileInfo, policyDisabled}, ref) => {
    useImperativeHandle(ref, () => ({
        verifyTheForm: () => {
            return dataSource.filter(file => !['客户告知书', '授权委托书'].includes(file.fileName));
        }
    }))
    const [RiskForm] = Form.useForm()
    const [dataSource, setDataSource] = useState([])
    const columns = [
        {title: '文件名称', dataIndex: 'fileName', key: 'fileName', align: 'center'},
        {
            title: '操作',
            key: 'action',
            render: (_, record, index) => (
                record.fileUrl ?
                    (<div className="table-options">
                            <span className="operation_style"
                                  onClick={() => lookOrEdit(record)}>{record.fileUrl ? '查看' : '--'}</span>
                        {!policyDisabled?<span className="operation_style danger" onClick={() => deleteRow(index)}>删除</span>:null}
                    </div>) : '--'
            ),
            width: 140,
            align: 'center'
        },
    ]
    // 查看修改
    const lookOrEdit = (record): void => {
        downloadFileForUrl(record.fileUrl, record.fileName)
    }
    // 删除
    const deleteRow = (index: number) => {
        setDataSource(dataSource.filter((_, i) => i !== index))
    }
    useEffect(() => {
        if (!carFileInfo || !carFileInfo.length) return
        setDataSource(carFileInfo)
    }, [carFileInfo])
    const getFiles = (val) => {
        if (!val.length) return
        const list = [...dataSource]
        list.push({fileName: val[0].name, fileUrl: val[0].url})
        setDataSource(list)
    }
    return (
        <div class="mt20">
            <PageModule title="相关资料"
                        btns={!policyDisabled?<CustomUpload getFiles={getFiles} moduleName="policy" showUploadList={false} />:null}>
                <Table dataSource={dataSource} columns={columns} bordered={true} size="middle" pagination={false} />
            </PageModule>
        </div>
    );
})
export default FileInfo;